<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>元素滚动事件</title>
		<style type="text/css">
		/*
		 1.元素滚动事件：
		 语法：
		 元素.onscroll=function(){
		 	
		 }
		 元素.scrollTop
		元素.scrollLeft
		元素滚动不存在兼容写法
		 必须有滚动条存在：
		 overflow:scroll
		 overflow-x:scroll
		 overflow-y:scroll
		 
		 
		 
		 
		 
		 
		 
		 
		 
		 
		 
		 
		 
		 
		 * 
		 * 
		 * 
		 * */
			div{
				width: 200px;
				height: 300px;
				border: 1px solid red;
				overflow-y:scroll;
			}
		</style>
	</head>
	<body>
		<div>
			<p>爱上对方过后广告费合法化的说法</p>
			<p>爱上对方过后广告费合法化的说法</p>
			<p>爱上对方过后广告费合法化的说法</p>
			<p>爱上对方过后广告费合法化的说法</p>
			<p>爱上对方过后广告费合法化的说法</p>
			<p>爱上对方过后广告费合法化的说法</p>
			<p>爱上对方过后广告费合法化的说法</p>
			<p>爱上对方过后广告费合法化的说法</p>
			<p>爱上对方过后广告费合法化的说法</p>
			<p>爱上对方过后广告费合法化的说法</p>
			<p>爱上对方过后广告费合法化的说法</p>
			<p>爱上对方过后广告费合法化的说法</p>
			<p>爱上对方过后广告费合法化的说法</p>
			<p>爱上对方过后广告费合法化的说法</p>
			<p>爱上对方过后广告费合法化的说法</p>
			<p>爱上对方过后广告费合法化的说法</p>
			<p>爱上对方过后广告费合法化的说法</p>
		</div>
		<button id='btn'>取到元素的末尾</button>
	  <script>
	  	var a=document.querySelector('div');
	  	var btn=document.getElementById('btn');
	  	btn.onclick=function(){
	  		a.scrollTop=10900000000;
	  	}
	  	
	  	
	  	
	  	
	  	
	  	
	  	
	  	/*
	  	 
	  	 * 
	  	 * 
	  	 * 
	  	 * 
	  	 * 
	  	 * 
	  	 * 
	  	 * 
	  	 * 
	  	 * 
	  	 * 
	  	 * 
	  	 * 
	  	 * 
	  	 * 
	  	 * 
	  	 * 
	  	 * 
	  	 * 
	  	 * 
	  	 * 
	  	 * 
	  	 * 
	  	 * 
	  	 * */
	  </script>
	</body>
</html>
